<%@ page pageEncoding="UTF-8" contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
    <link rel="stylesheet" type="text/css" href="./css/css.css"/>
    <title>iCart HTML Version</title>
</head>
<body>

<%@ include file="_common_header_nav.jsp" %>

<%-- TODO 新增一个订单页面地址为/order --%>

<div style="width:1000px;margin: 0 auto;margin-top:10px;">
    <div class="linktree">
        <a href="/index">主页</a>
        &raquo; <a href="/order">订单</a>
    </div>

    <br>

    <div class="cart-info">

            <c:forEach items="${requestScope.orderItems}" var="orderItem">
            <p>
                <br/>
            </p>
            <table data-sort="sortDisabled">
                <tbody>
                <tr class="firstRow">
                    <td valign="top" rowspan="1" colspan="4" style="word-break: break-all;">
                        订单编号：${orderItem.id}
                    </td>
                    <td valign="top" rowspan="1" colspan="4" style="word-break: break-all;">
                        下单时间：${orderItem.createTime}<br/>
                    </td>
                </tr>
                <tr>
                    <td width="74" valign="top" style="word-break: break-all;">
                        图片<br/>
                    </td>
                    <td width="280" valign="top" style="word-break: break-all;">
                        名称
                    </td>
                    <td width="74" valign="top" style="word-break: break-all;">
                        产品ID
                    </td>
                    <td width="74" valign="top" style="word-break: break-all;">
                        价格
                    </td>
                    <td width="74" valign="top" style="word-break: break-all;">
                        数量
                    </td>
                    <td valign="top" style="word-break: break-all;" rowspan="1" colspan="2">
                        收件地址<br/>
                    </td>
                    <td width="74" valign="top" style="word-break: break-all;">
                        总价
                    </td>
                </tr>


                <c:forEach items="${orderItem.products}" var="product" varStatus="status">

                <tr>
                        <td width="74" valign="top" style="word-break: break-all;">
                            <a href="/product/${product.pid}"><img style="height: 80px;width: 80px;"
                                                                         src="${product.imgUrl}"
                                                                         alt="${product.name}"
                                                                         title="${product.name}"/></a>

                        </td>
                        <td width="74" valign="top" style="word-break: break-all;">
                                ${product.name}
                        </td>
                        <td width="74" valign="top" style="word-break: break-all;vertical-align: middle;text-align: center;">
                               Product ${product.pid}
                        </td>
                        <td width="74" valign="top" style="word-break: break-all;vertical-align: middle;text-align: center;">
                                ${product.price}
                        </td>
                        <td width="74" valign="top" style="word-break: break-all;vertical-align: middle;text-align: center;">
                                ${product.quantity}
                        </td>


                    <c:if test="${status.count == 1}">
                    <td valign="top" rowspan="${fn:length(orderItem.products)}" colspan="2" style="word-break: break-all;vertical-align: middle;text-align: center;">
                        <p>
                            ${orderItem.address.addr}
                        </p>
                        <br/>
                        <p>
                                ${orderItem.address.name} 收
                        </p>
                        <br/>
                        <p>
                            电话号：${orderItem.address.tel}
                        </p>
                    </td>
                    <td width="74" valign="top" rowspan="${fn:length(orderItem.products)}" colspan="1" style="word-break: break-all;vertical-align: middle;text-align: center;">
                        ￥${orderItem.totalPrice}
                    </td>
                    </c:if>

                </tr>

                </c:forEach>

                </tbody>
            </table>
            <p>
                <br/>
            </p>
            </c:forEach>

    </div>

</div>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<div class="icart-footer">
    <div class="icart-footer-top">
        <div style="width:1000px; margin:0 auto;">
        </div>
    </div>
    <div class="icart-footer-container">
        <div class="column_footer" style="width:350px;">
            <h3>About Us</h3>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vel ante felis, aliquet sagittis lacus.
            Etiam in purus vitae tortor lacinia pretium. Maecenas quam diam, porttitor bibendum lacinia a, feugiat sit
            amet felis. Praesent ut mi justo, a volutpat ligula. Praesent sodales felis sed odio consectetur eget cursus
            metus mollis. Proin sollicitudin accumsan lectus a ornare... .
        </div>

        <div class="column_footer">
            <h3>Customer Service</h3>
            <ul>
                <li><a href="#">About Us</a></li>
                <li><a href="#">Delivery Information</a></li>
                <li><a href="#">Privacy Policy</a></li>
                <li><a href="#">Terms &amp; Conditions</a></li>
                <li><a href="#">Contact Us</a></li>
                <li><a href="#">Returns</a></li>
                <li><a href="#">Site Map</a></li>
            </ul>
        </div>

        <div class="column_footer" style="width:150px;">
            <h3>Extras</h3>
            <ul>
                <li><a href="#">Brands</a></li>
                <li><a href="#">Gift Vouchers</a></li>
                <li><a href="#">Affiliates</a></li>
                <li><a href="#">Specials</a></li>
            </ul>
        </div>
        <div class="column_footer" style="width:150px;">
            <h3>My Account</h3>
            <ul>
                <li><a href="#">My Account</a></li>
                <li><a href="#">Order History</a></li>
                <li><a href="#">Wish List</a></li>
                <li><a href="#">Newsletter</a></li>
            </ul>
        </div>

        <div class="column_footer" style="margin-right:0px;">
            <h3>Social</h3>
            <ul class="social">
                <li class="twitter"><a href="../../twitter.com/twitter">Twitter Username</a></li>
                <li class="facebook"><a href="../../facebook.com/Username/default">Facebook</a></li>
                <li class="rss"><a href="#">RSS Feed</a></li>
            </ul>
        </div>
        <div class="clearfix"></div>
    </div>
    <div class="icart-footer-bottom">
        <div style="width:1000px; margin:0 auto;">
            <div class="icart-logo-footer"><a href="index.php"><img src="images/logo-footer.png" alt="Footer Logo"></a>
            </div>
            <ul>
                <li style="float:right;padding-top:10px;list-style:none;">&copy; Copyright &copy; 2013.Company name All
                    rights reserved.<a target="_blank"
                                       href="http://www.cssmoban.com/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a> - More
                    Templates </li>
            </ul>
            <div class="clearfix"></div>
        </div>

    </div>
</div>

</body>
</html>